import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_switch/flutter_switch.dart';
import 'package:get/get.dart';
import 'package:yi_shop/route/index.dart';
import 'package:yi_shop/ui/draw_under_line.dart';
import 'package:yi_shop/utils/colors.dart';
import 'package:yi_shop/utils/styles.dart';
import 'package:yi_shop/utils/tools.dart';

class MineSettingAccountController extends GetxController {
  Rx<_UserModel> user = Rx(_UserModel(
    nickname: '原型大师',
    account: 'qxhlld321',
    avatar:
        'https://img0.baidu.com/it/u=3762686575,934747082&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1712768400&t=9ee37c534e5ae0adcc226f923ece69dd',
  ));

  RxBool isDefault = true.obs;
}

class MineSettingAccountPage extends GetView<MineSettingAccountController> {
  const MineSettingAccountPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: ToolsUtils.builderLeading(),
        title: Text(
          '账户设置',
          style: StylesUtils.customTextStyle(
              fontSize: StylesUtils.fontSize18, fontWeight: FontWeight.w700),
        ),
      ),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Container(
              color: Colors.white,
              padding: const EdgeInsets.only(top: 10, bottom: 10, left: 15, right: 20),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  ObxValue(
                      (user) => CircleAvatar(
                            radius: 25,
                            backgroundImage: CachedNetworkImageProvider(user.value.avatar),
                          ),
                      controller.user),
                  Expanded(
                      child: Container(
                    padding: const EdgeInsets.only(left: 10),
                    child: Column(
                      children: [
                        Align(
                          alignment: Alignment.centerLeft,
                          child: Obx(() => Text(
                                controller.user.value.nickname,
                                style: StylesUtils.customTextStyle(
                                    color: ColorsUtils.color3333, fontSize: StylesUtils.fontSize18),
                              )),
                        ),
                        Container(
                          margin: const EdgeInsets.only(top: 10),
                          alignment: Alignment.centerLeft,
                          child: Obx(() => Text(
                                '用户名：${controller.user.value.account}',
                                style: StylesUtils.customTextStyle(color: ColorsUtils.color9999),
                              )),
                        )
                      ],
                    ),
                  )),
                  Center(
                    child: IconButton(
                        onPressed: () {
                          Get.toNamed(RoutePath.mineSettingInfo);
                        },
                        icon: Icon(
                          Icons.arrow_forward_ios,
                          size: 15,
                          color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc),
                        )),
                  )
                ],
              ),
            ),
            DrawUnderLine(
              color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorF2f2),
              child: Container(
                margin: const EdgeInsets.only(top: 20),
                color: Colors.white,
                padding: const EdgeInsets.only(top: 10, bottom: 10, left: 15, right: 20),
                alignment: Alignment.centerLeft,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      '修改密码',
                      style: StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                    ),
                    IconButton(
                        onPressed: () {},
                        icon: Icon(
                          Icons.arrow_forward_ios,
                          size: 15,
                          color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc),
                        )),
                  ],
                ),
              ),
            ),
            DrawUnderLine(
              color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorF2f2),
              child: Container(
                color: Colors.white,
                padding: const EdgeInsets.only(top: 10, bottom: 10, left: 15, right: 20),
                alignment: Alignment.centerLeft,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      '绑定手机',
                      style: StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                    ),
                    IconButton(
                        onPressed: () {},
                        icon: Icon(
                          Icons.arrow_forward_ios,
                          size: 15,
                          color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc),
                        )),
                  ],
                ),
              ),
            ),
            DrawUnderLine(
              color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorF2f2),
              child: Container(
                color: Colors.white,
                padding: const EdgeInsets.only(top: 10, bottom: 10, left: 15, right: 20),
                alignment: Alignment.centerLeft,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      '实名认证',
                      style: StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                    ),
                    IconButton(
                        onPressed: () {
                          Get.toNamed(RoutePath.mineSettingIdentification);
                        },
                        icon: Icon(
                          Icons.arrow_forward_ios,
                          size: 15,
                          color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc),
                        )),
                  ],
                ),
              ),
            ),
            DrawUnderLine(
              color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorF2f2),
              child: Container(
                color: Colors.white,
                padding: const EdgeInsets.only(top: 10, bottom: 10, left: 15, right: 20),
                alignment: Alignment.centerLeft,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      '手势解码',
                      style: StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                    ),
                    IconButton(
                        onPressed: () {
                          Get.toNamed(RoutePath.mineSettingGesture);
                        },
                        icon: Icon(
                          Icons.arrow_forward_ios,
                          size: 15,
                          color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc),
                        )),
                  ],
                ),
              ),
            ),
            DrawUnderLine(
              color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorF2f2),
              child: Container(
                color: Colors.white,
                padding: const EdgeInsets.only(top: 10, bottom: 10, left: 15, right: 20),
                alignment: Alignment.centerLeft,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Wrap(
                      crossAxisAlignment: WrapCrossAlignment.center,
                      alignment: WrapAlignment.start,
                      spacing: 10,
                      children: [
                        Text(
                          '关于',
                          style: StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                        ),
                        TextButton(
                            onPressed: () {},
                            style: ButtonStyle(
                                backgroundColor: MaterialStatePropertyAll(
                                    ColorsUtils.parseColorFromHexString(ColorsUtils.colorF048)),
                                fixedSize: const MaterialStatePropertyAll(Size(50, 20)),
                                minimumSize: const MaterialStatePropertyAll(Size(50, 20)),
                                padding: const MaterialStatePropertyAll(EdgeInsets.zero),
                                alignment: Alignment.center,
                                shape: MaterialStatePropertyAll(RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(10)))),
                            child: Text(
                              'new',
                              style: StylesUtils.customTextStyle(
                                fontSize: StylesUtils.fontSize13,
                              ),
                            ))
                      ],
                    ),
                    Wrap(
                      spacing: 10,
                      crossAxisAlignment: WrapCrossAlignment.center,
                      alignment: WrapAlignment.end,
                      children: [
                        Obx(() => FlutterSwitch(
                              width: 48,
                              height: 24,
                              activeToggleColor: Colors.white,
                              activeColor:
                                  ColorsUtils.parseColorFromHexString(ColorsUtils.colorF26f),
                              inactiveColor:
                                  ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc),
                              toggleSize: 22,
                              padding: 2,
                              value: controller.isDefault.value,
                              onToggle: (bool value) {
                                controller.isDefault.value = value;
                              },
                            )),
                        IconButton(
                            onPressed: () {},
                            icon: Icon(
                              Icons.arrow_forward_ios,
                              size: 15,
                              color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc),
                            )),
                      ],
                    ),
                  ],
                ),
              ),
            ),
            Container(
              color: Colors.white,
              padding: const EdgeInsets.only(top: 10, bottom: 10, left: 15, right: 20),
              alignment: Alignment.centerLeft,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    '退出',
                    style: StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                  ),
                  IconButton(
                      onPressed: () {},
                      icon: Icon(
                        Icons.arrow_forward_ios,
                        size: 15,
                        color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc),
                      )),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class _UserModel {
  String nickname;

  String avatar;

  String account;

  _UserModel({required this.nickname, required this.avatar, required this.account});
}
